import React,{Component} from 'react'
import $ from 'jquery'
import * as fetch from '../../config/fetch';
import * as pub from '../../config/public';
import {message,Spin} from 'antd';
class StoryLine extends Component {
	constructor(args) {
		super();
    this.state={
      chapter:'',
      sex:'man',
      showJF:false,
      allLevelSet:[]
    }
	}
  levelSet(){
    pub.loading(this, true);
    fetch.levelSet().then((data)=>{
         if (data.result === 'RC100') {
           this.setState({
              allLevelSet:data.allLevelSet?data.allLevelSet:[]
           })
         }else{
				message.error(data.errMsg, 3);
			}
      pub.loading(this, false);
		}, (res) => {
		   	pub.reject(res);
         pub.loading(this, false);
		})
  }
  showJF=()=>{
    this.levelSet();
    this.setState({
      showJF:!this.state.showJF
    })
  }
  showNoJF=()=>{
    this.setState({
      showJF:false
    },()=>{
      this.storyLine();
    })
  }
  storyLine(){
     fetch.storyLine().then((data)=>{
         if (data.result === 'RC100') {
           this.setState({
             chapter:data.chapter,
             sex:data.sex===1?'man':'woman'
           },()=>{
              var chapter=this.state.chapter;
              $('.base').click(function() {
              $(this).addClass('active').siblings().removeClass('active');
              $(this).addClass('active').siblings().find('.fxz').fadeOut();
              // $(this).find('.fxz').fadeIn();
              var index = $(this).index();
              if(index<=chapter){
                $(this).find('.fxz').fadeIn();
                $('.tab').hide().eq(index).show();
                //  var data = ['《蜂行者》-楔子', '第一章-天道不公', '第二章-人道不平', '第三章-血性儿郎', '第四章-无良军痞', '第五章', '第六章', '第七章'];
                //  $(this).find('.fxz').html('<h2>'+data[index]+'</h2>');
              }else{
                $('.tab').hide().eq(index).hide();
                $('.base').find('.fxz').css({display:"none"});
                $('.base').addClass('active').siblings().removeClass('active');
                 message.warning("未解锁",3)
              }
	      	})
        })
         }else{
				message.error(data.errMsg, 3);
			}
		}, (res) => {
		   	pub.reject(res);
		})
  }
	componentWillMount() {
    this.levelSet();
		this.storyLine();
	}
	render(){
    let sex=this.state.sex;
    // let index=1;
		return(
      <div>
        {
      this.state.showJF?
      <div>
    <div className="wrapper bg-F0F4F6">
			<div className="layout" >
				<div className="jf-table">
          <a onClick={()=>{this.showNoJF()}} style={{display: 'block',width: '100%',padding:'5px 20px',boxSizing:'border-box',textAlign: 'right',color: '#006DCC'}}>--返回故事线--</a>
					<ul className="table-title clearFix">
						<li>序号</li>
						<li>积分称谓</li>
						<li>
							<div style={{width: '100%',borderBottom: '1px solid #D9E7F6'}}>积分标准</div>
							<div style={{width: '50%',borderRight: '1px solid #D9E7F6'}}>≥</div>
							<div style={{width: '50%'}}>≤</div>
						</li>
						<li>{(JSON.parse(localStorage.getItem('user')).channelId)==='4'?'星行之力级别':'蜂行之力级别'}</li>
					</ul>
          <Spin spinning={this.state.loading} tip="加载列表中...">
					<ul className="table-td">
            {
              this.state.allLevelSet.map((item,index)=>{
                return(
                <li key={index}>
									<span>{index+1}</span>
									<span>{item.integralName}</span>
									<span>{item.integralBegin}</span>
									<span>{item.integralEnd}</span>
									<span>{item.beeLinePowerName}</span>
					     	</li>
                )
              })
            }
					</ul>
          </Spin>
				</div>
			</div>
		</div>
    </div>:<div style={{minHeight:'783px'}}>
			<div className="wrapper bg-F0F4F6" style={{paddingBottom: 0}}>
        <div className="story-bg">
          <div className="layout" style={{paddingTop:'150px'}}>
            <div className="island-light" />
            <div className="island">
              <div className="base base-1">
                <a>
                  <div className="light-1" />
                  <div className={`fxz ${sex}`} />
                </a>
              </div>
              <div className="base base-2"><a><div className="light-1" /><div className={`fxz ${sex}`} /></a></div>
              <div className="base base-3"><a><div className="light-1" /><div className={`fxz ${sex}`} /></a></div>
              <div className="base base-4"><a><div className="light-1" /><div className={`fxz ${sex}`} /></a></div>
              <div className="base base-5"><a><div className="light-1" /><div className={`fxz ${sex}`} /></a></div>
              <div className="base base-6"><a><div className="light-1" /><div className={`fxz ${sex}`} /></a></div>
              <div className="base base-7"><a><div className="light-1" /><div className={`fxz ${sex}`} /></a></div>
              <div className="base base-8"><a><div className="light-1" /><div className={`fxz ${sex}`} /></a></div>
            </div>
            <div className="word" id="word">
              <p><button onClick={()=>{this.showJF()}} className="floatR" style={{color: '#FFFFFF'}}>积分规则</button></p>
              <div className="tab">
                <h2  style={{color:"white"}}><i className="icon-double-angle-left" />蜂行者<i className="icon-double-angle-right" /></h2>
                <h3  style={{color:"white"}}><i className="icon-double-angle-left" />楔子<i className="icon-double-angle-right" /></h3>
                <p>佛说：<br />
                
                  一花一世界，一木一浮生；<br />
                  一草一天堂，一叶一如来；<br />
                  一砂一极乐，一方一净土；<br />
                  一笑一尘缘，一念一清静。</p>
                <p>当代物理学的探索发展和研究实践，越深入就越与哲学、宗教相契合。多维空间、平行世界、超弦理论、多重宇宙、量子学说等一系列的理论和论证，似乎都在为地球这颗孤独的生命体寻求慰籍。从科学的角度出发，凡是没有被物理实践所观测到的，都是不存在的伪科学。但在哲学辨证视角下，不能证明的不存在，就意味着存在。</p>
                <p>恰恰正是因为哲学的存在和发展，使物理学的猜想更为大胆并具有无以伦比的创新。“当你正在看这些文字的同时，与此同时，在另一个宇宙中也恰好有另一个你，也正在阅读这些文字。”</p>
                <p>“每一个不同选择，都将可能引导成立一个新的宇宙。”</p>
                <p>“所有的神话，诸如希腊诸神、北欧诸神、中国封神榜、山海经等，甚至我们光怪陆离的梦境，都有可能是其他宇宙正在发生的。”</p>
                <p>“量子力学中挑战传统经典物理的实验——薛定谔之猫之后，粒子叠加态的实验不断升级，已在《自然》上发表了多个版本，似乎距离我们想要了解的真相越来越近。”</p>
                <p>据新华社北京6月16日电（记者林小春 黄堃）从百公里到千公里，中国“墨子号”量子卫星将量子纠缠分发的世界纪录提高了一个数量级。15日美国《科学》杂志发布了中国“墨子号”量子卫星的重大成就，并在一份简介中将这项中国科学家独立完成的工作称为“一项里程碑式的研究”。</p>
                <p>我们曾不知道的、不理解的、不相信的存在，总在一步一步向我们走来!</p>
                <p>以地球所在的宇宙为“1号宇宙”称谓来定义的话，在第122号宇宙的HT星系中，有一颗叫做“蜂王”的类地行星。蜂王星是一颗有生命体的星球，与“1号宇宙”银河系中的地球不同的是，蜂王星上的居民构成比较复杂，有蜂族，有人族，有兽人族，有精灵族，有海族等多个种族混居，其中最大的陆地是蜂行大陆，因人族信仰的图腾为蜂王，可以觉醒蜂行之力，从而成为蜂行者而得名。</p>
              </div>
              <div className="tab">
                    <h2 style={{color:"white"}}>第一章 天道不公</h2>
                <p>凛冬已至，夜甚寒。</p>
                <p>本已早应到了入眠的时间，可德莱小镇上的每个石屋都透着光亮。</p>
                <p>家家户户的男人们坐在各自的炉火旁，或深思、或叹气、或酩酊大醉、或局促不安，石墙上的身影随着炉火摇曳着，似乎在挣扎着什么。</p>
                <p>女人们要么捶足顿胸，要么看着熟睡的孩子们偷偷抹着眼泪。</p>
                <p>这个冬天啊！怎么这么寒冷！冷得痛彻心扉！</p>
                <p>这个既漫长又短暂的夜晚啊！注定随着炉火的熄灭而走向终结！</p>
                <p>“照顾好我们的儿子，呵呵！”蜂大壮握紧了拳头，但看向媳妇和孩子的眼神却很柔和，憨厚的笑声似乎让白秋焦虑的神情缓和了很多，她恍惚中依然觉得，这和往常的每天早晨一样，大壮只是去山里打猎了。</p>
                <p>“都快点，自觉点出门了！别让军爷们等急了，去你们家绑人就晚了！”屋外一阵马蹄声后，响起了一声大嗓门的吆喝。</p>
                <p>白秋看着大壮朴实的笑容，想要说点什么，终究还是忍住了，可眼泪却止不住地往下掉。</p>
                <p>“呵呵，我走了，我会回来的，等我，秋。”蜂大壮看了一眼还在睡的儿子，毅然转身拉开了木门。</p>
                <p>那一道清晨的阳光，顺着木门洒了进来，似乎要驱散这一夜的黑暗。</p>
                <p>蜂大壮闭上了眼睛，感受着这第一缕晨光，就像往常一样，沐浴着温暖。</p>
                <p>他知道不可能再一样了，只是想最后再感受一次。</p>
                <p>“啪！”一道凌厉的鞭子，抽在了蜂大壮的脸上。</p>
                <p>“还磨蹭什么？赶紧出来排队，前线吃紧，所有德莱镇上的成年人都要参战！兽人们可不给你享受的时间。”战马上的军官厉声喝道。</p>
                <p>“壮哥。。。”屋中的白秋心里一紧。
                  “把门插好，别出来，我没事。”大壮也不回头看，反手把门扣上了，不顾脸上的疼痛，加入了征兵的队伍。
                  白秋的心很痛，捂着胸口不停地抽泣，此刻，她必须要听大壮的话，不仅插好了门，还用身体靠住了门。</p>
                <p>“啊？你醒了？小白”白秋背靠着门的时候，看见了站在窗边的蜂小白。
                  “妈妈，你为什么哭了？”
                  “妈妈，他们为什么带走爸爸？”
                  “妈妈，他们为什么要打爸爸？”</p>
                <p>看着只有十一岁大的孩子不断地问着自己，白秋揪着心的难受，一下冲到蜂小白的面前，跪在地上抱着他，放声大哭。
                  “妈妈不哭，妈妈不哭，爸爸一定不会不要我们的！爸爸一定会回来的！”
                  “妈妈不哭，我不问了！”
                  蜂小白抱着妈妈，不断地拍着白秋的后背，虽然声音还很稚嫩，但眼神却很清澈坚定。
                  “妈妈不哭了，放心吧，等我明年觉醒蜂行之力的，就再也没有人欺负我们了。”
                  白秋抱着蜂小白的手更紧了，唇齿之间早已咬出丝丝血印。</p>
              </div>
              <div className="tab">
                <h2 style={{color:"white"}}>第二章 人道不平</h2>
                <p>少年，山顶，土狗阿花。</p>
                <p>与德莱小镇的其他孩子不同，蜂小白不哭也不闹。和镇上的孩子因为家父和兄长被强行征兵走后，连续几天哭天抹泪相比而言，蜂小白则是每天早早起来，安慰母亲后，独自进山获取食材，空了时间，就坐在山顶，怔怔地看着德莱小镇出神。</p>
                <p>那一片皑皑白雪覆盖的德莱小镇，在袅袅的炊烟与闪烁的灯火中，表现得依然还是那么静谧，那么美。可镇上每个居民的心里，却有挥之不去的阴霾和伤痛。</p>
                <p>无论发生什么，日子可是总要过下去的！
                  在蜂小白的这个年纪，能够做到如此，确实不多见。他知道自己绝对有理由悲伤难过，但却没有办法解决问题，再多的愤怒发泄，只能给母亲增加更重的负担。</p>
                <p>“阿爸一定会没事的，一定会回来的。走了，阿花！”蜂小白晃了晃脑袋，纵身一跃，向着家的方向，与土狗阿花一同奔跑，渐隐于暮色之中。
                  “啊，怎么这么吵？阿妈？”清晨，被外面噪杂声音闹醒的蜂小白，揉了揉眼睛问道。
                  “没什么事，一会吃了早饭，进山要小心，千万别逞能！”白秋严肃地说道，她本来心里就担心这蜂大壮，可不想小白再出什么意外。</p>
                <p>小白走到蜂栖木饭桌前，拿起一个抹了黄蜂蜜的蜂麦面包，边咬边打开窗子，看到很多人往镇子中心广场方向涌去。
                  “嗨，三胖子，出什么事了？你跑那么快干什么？”蜂小白伏在窗台上，探着脑袋和小伙伴喊道。
                  “啊，小白，你说什么？”三胖子听到有人喊自己，抬头顺着大青石垒砌的墙壁，看到了蜂小白。
                  “我说，你跑啥？鞋都跑丢一只，知道不？”蜂小白大声喊道。</p>
                <p>“啊？”三胖子低头看了一眼，但速度可是一点没降下来。
                  “顾不了那么多了，大黑妞一早上告诉我，我妈被镇长打了，我得赶紧过去看看。”三胖子的声音渐渐远去。
                  “别听大黑妞骗你，镇长怎么可能打你妈，他不是也。。。”蜂小白继续吃着手里的蜂麦面包。
                  “诶？不对，不是镇上所有的男人都被征兵去了么？”蜂小白心里一惊，扔下手里的面包夺门而出。</p>
                <p>“小白！小白！回来！”白秋的声音在蜂小白的身后响起来，可是并没有用。
                  “这个孩子！”白秋眉头一皱。
                  “有些事情，他迟早要独自面对。”白秋脚边坐着的土狗阿花突然说了一句人话。</p>
              </div>
              <div className="tab">
                <h2 style={{color:"white"}}>第三章 血性儿郎</h2>
                <p>“唉，我总怕小白出事，那就对不起小姐了，幸好有你护着，花姑。”白秋蹲下身，紧紧地抱住了阿花。
                  “放心吧，我会看着小的，不过大的我可管不了。”土狗阿花眼中闪过一道精光。</p>
                <p>蜂小白来到镇中广场的时候，已经是人山人海了，蜂小白没费劲就爬上了西姆家酒馆的屋顶，几乎是镇上所有的女人和孩子都在了，把镇长一家四口和护卫围了起来。</p>
                <p>“凭什么？凭什么我家男人被抓去当兵，你镇长可以大摇大摆的在这里？凭什么我们大家的成年儿子要被抓去前线，你镇长家的大儿子都二十了吧，为什么可以不用去？这是什么世道？你们还打我？我不活了！”三胖子妈捂着红肿的脸，趴在镇长护卫们身前的地上哀嚎。</p>
                <p>此刻，三胖子张开手臂，护在他母亲的身前，瞪着镇长一行人，满眼仇恨。
                  “三胖子有血性！”蜂小白一边心中默道，一边敲碎了西姆酒馆屋顶一块红土烧制的瓦片，将一些碎瓦砾捏在了手里。</p>
                <p>“得，得，你也别再这里瞎嚎，我告诉你，我们是花了大价钱的，才保住我家男人和孩子的，有能耐你也去花钱啊，你可别在这里犯浑了，不然军爷们赐我们家的这些护卫们可不是吃素的，再不走，接下来就不是打你脸这么简单的事。”镇长那肥得已经快冒油的夫人轻蔑地道。</p>
                <p>“怎么这样，平时镇长一家不是挺好的嘛，还收各家的山货去大城市售卖。”围观人群中有人嘀咕道。
                  “老婶子啊，我可听说我们这山货在大城市里的价格很高，可不止镇长给我们这点钱啊。”
                  “镇东头老王头之前可跟我说，黄蜂郡那里，可没和我们德莱小镇收那么多的税，都是镇长自己定的。”</p>
                <p>“唉，能有什么办法，就剩下我们这些老弱妇孺，能怎么办？认命呗。”说话的女人眼神中一片空洞。
                  “我不服！我就是不服！”三胖子妈歇斯底里地喊了起来，围观人群的议论声也大了起来。
                  “不服？哼！那就打到你服！”从前总是一脸和气的镇长突然换了嘴脸。
                  “动手！”</p>
                <p>获得了命令的护卫们，高高举起了手中的长棍，向着三胖子母子的头上挥去。
                  “啪！”一声闷响之后，镇长夫人额头肿起一个大大的包，血水也顺着油乎乎的面颊流了下来。
                  “啊，谁？”镇长心中大惊，火速猫着腰躲在了护卫的身后，颤抖地嚷着。
                  护卫们也停下了手中的棍子。</p>
                <p>“是他，蜂小白，那个臭傻子，你有种别跑。”镇长二儿子一眼就看到了蜂小白的身影，也是蜂小白之前给他的疼痛太深。
                  “给我抓住他，往死里揍！”镇长的肥婆娘，捂着脑袋，疯狂地叫喊着。
                  看到护卫们推开人群，呼啦一下向自己追来。蜂小白又扔出几粒碎瓦后，转身一跃向山里跑去。
                  “等着你家白爷爷回来，我还揍你，二货查理。”
                  蜂小白的声音似乎比这寒冬还冰冷，让镇长的小儿子心里一颤。</p>
              </div>
              <div className="tab">
                <h2 style={{color:"white"}}>第四章 无良军痞</h2>
                <p>朝着山里的方向，蜂小白一直在奔跑。</p>
                <p>任凭耳边呼啸的风声，和身后追赶自己的护卫们,一并呼啸刺耳。</p>
                <p>这条通往山里的路，蜂小白很熟悉，小时候时常跟随父亲进山，不仅练就了一身野外生存的好本领，也让他的敏捷性高于一般的孩子。</p>
                <p>即使如此，一个十多岁大的孩子也无法比得过这些军队里的护卫们，那可是一些已经达到军士级别的护卫，哪怕是1阶军士级别的护卫，也至少拥有一千二百的蜂行之力。</p>
                <p>所以这距离，越来越近，蜂小白的身子再灵活敏捷，或许也跑不多远了。
                  可他就那么一直奔跑，绝不回头，因为阿爸和他说过，在山里，一但遇到猛兽追击，如果打得过，就必须正面迎击；如果要跑，必须不能回头。</p>
                <p>后面追击蜂小白的护卫们，在追赶中互相看了一眼，他们此刻也很吃惊，这都好一会儿了，几个大人，并且是几个拥有蜂行之力的军士，竟然追不上一个孩子？他们不仅诧异于这孩子的脚力，同时也不明白为什么在冰雪混合夹杂着招蜂草的山路上，他竟然没有一次滑倒。</p>
                <p>该来的还是要来，背部一阵剧烈的疼痛，让蜂小白重重地摔倒在地，由于惯性的作用，他又趴着身子向前滑出了很远，那一侧脸颊贴着地面，刺痛着。</p>
                <p>是护卫手里甩出的那根长棍，重击了蜂小白的背部，虽然身体已几乎不能动弹，但他还是忍着剧痛抬起头，看向前方的丛林，他心中不甘，就差一步，就差一步他就可以进入丛林，那里他更熟悉，更适合他逃脱，并且穿过丛林有一处悬崖，那悬崖之下是常年不冻的蜂栖湖，只要跳入湖中，以他的水性，这些人肯定抓不到自己。</p>
                <p>可惜啊！
                  “臭小子，真能跑，你跑啊，你再跑啊！”一护卫捡起手中的长棍，说话的气息有些不稳定。
                  当被长棍挑翻身以后，蜂小白看到三个穿着黄蜂军服饰的男子，为首说话的人长得一脸凶相，怎么看都不像是个军人。
                  蜂小白虽然年纪不大，但也是跟随父亲在山里有常年打猎的经验，面对一些异常凶猛的魔兽，也遭遇过危险，所以他知道越是危险的时刻，越要冷静，以寻求生机。
                  蜂小白咬着牙，用手肘撑着地，想要坐起来，即使身体再疼也要再次寻找挣脱的机会。
                  “啪！”又是一棍子，结实地杵在了他的胸口。</p>
                <p>“怎么的？还想跑，给我老实地躺着吧，就你这点小伎俩，还要在我面前耍耍？”一脸凶相的护卫张狂地说道，他并没有怜惜对面只是个孩子，虽然没有使用蜂行之力，但一个成年男子手中的力道也是不小，况且还是用棍子。</p>
                <p>“咳！咳咳！”这一棍子属实不轻，蜂小白知觉胸中一阵疼痛憋闷，还没坐直就仰面躺去，身子也失去控制的拍在了地上。
                  幸亏是寒冬时节，地面上的冰冷，让他还保持了一丝清醒，否则在这样连续重击之下，定会昏迷过去。
                  “哼！今天就让你看看军爷我的手段。”凶男心里也憋屈着，这在战场上都经历过的人，受命保护个小镇上的土豪，还被眼前这小子给丢了面，并且还让他追了这么远。</p>
                <p>军人不应该保家卫国，保护平民么？为什么要欺负我们？为什么？”躺在地上的蜂小白此刻已经彻底不能动弹了，但他还能说话， 还能呼喊。
                  仰面朝天，他或许也在质问老天。
                  “小崽子，还挺硬，我到要看你到底有多硬？”凶男的棍子再次高高举起。
                  破空之声响起，“咔！”这正在下落的棍子，竟然断成了两节。</p>
              </div>
              <div className="tab">
                <h2 style={{color:"white"}}>第一章</h2>
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
              </div>
              <div className="tab">
                <h2 style={{color:"white"}}>第一章</h2>
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
              </div>
              <div className="tab">
                <h2>第一章</h2>
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
                <p />
              </div>
            </div>
          </div>
        </div>
      </div>
			</div>
    }
			</div>
			)
	}
}
export default StoryLine;